<template>
  <view class="wrap">
    <view class="item-item" @click="cooperateInfo(cooperate.id)">
      <view class="item-name-date">
        <view class="name">
          {{cooperate.name ||""}}
        </view>
        <view class="date">
          {{cooperate.createTime|dateFormat}}
        </view>
      </view>

      <view class="tags">
        <block v-for="tag in cooperate.tags.split(',')">
          <view class="tag">
            {{tag}}
          </view>
        </block>
      </view>
      <view class="line-box">
        <view class="left">
          项目类型:
        </view>
        <view class="right">
          {{cooperate.type || ""}}
        </view>
      </view>
      <view class="line-box">
        <view class="left">
          数量:
        </view>
        <view class="right">
          {{cooperate.count||"0"}}
        </view>
      </view>

      <view class="line-box">
        <view class="left">
          概述:
        </view>
        <view class="right">
          {{cooperate.outline||""}}
        </view>
      </view>
      <u-parse :html="cooperate.content" :domain="domain"></u-parse>

      <view class="item-address-browses">
        <view class="address">{{cooperate.address||""}}</view>
        <view class="address">{{cooperate.browses||"0"}}人浏览数</view>

      </view>

    </view>

  </view>
</template>

<script>
  /**
   * Copyright (c) 2013-Now http://aidex.vip All rights reserved.
   */
  export default {
    data() {
      return {
        cooperate: {

        },
        domain: "",

      };
    },
    filters: {
      //过滤器 用于格式化时间
      dateFormat: function(value) {
        // var date = new Date(value); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
        // var year = date.getFullYear();
        // var month = ("0" + (date.getMonth() + 1)).slice(-2);
        // var sdate = ("0" + date.getDate()).slice(-2);
        // var hour = ("0" + date.getHours()).slice(-2);
        // var minute = ("0" + date.getMinutes()).slice(-2);
        // var second = ("0" + date.getSeconds()).slice(-2);
        // // 拼接
        // var result = year + "-" + month + "-" + sdate;
        var result = value.slice(0, 10);
        // 返回
        return result;
      },
    },
    onLoad(option) {
      this.domain = this.domain;
      var id = option.id;
      this.$u.api.getWindProjectCooperateInfo({
        id: id,
      }).then(res => {
        this.cooperate = res.data;
        console.log(res.data, "数据")
      });
      this.$u.api.browsesWindProjectCooperates({
        id: 1,
      }).then(res => {
        console.log(res.data, "数据")
      });
    },
    computed: {

    },
    onReady() {

    },
    methods: {


    }
  };
</script>

<style lang="scss">
  .wrap {
    padding: 10rpx;

  }

  .title {
    font-size: 50rpx;
    text-align: center;
  }

  .item-item {
    display: flex;
    margin: 10rpx 15rpx;
    padding: 10rpx 20rpx;
    border-radius: 8rpx;
    background-color: #FFFFFF;
    //height: 188rpx;
    justify-content: space-between;
    flex-direction: column;
    margin-top: 10rpx;

    .item-author-browses {
      display: flex;
      justify-content: space-between;
      flex-direction: row;
    }
  }

  .line-box {
    display: flex;
    margin-top: 10rpx;

    .left {

      font-size: 26rpx;
      font-family: PingFang SC;

      color: #999999;
      line-height: 40rpx;
    }

    .right {

      font-size: 24rpx;
      font-family: PingFang SC;
      margin-left: 10rpx;
      color: #333333;
      line-height: 40rpx;
    }

  }

  .tags {
    display: flex;
    margin-top: 10rpx;

    .tag {
      background: #3BA2FF;
      //opacity: 0.5;
      padding: 5rpx;
      color: #FFFFFF;
      border-radius: 18rpx;
      margin: 1rpx;
      font-size: 24rpx;
      font-family: PingFang SC;


    }

    .tag1 {
      font-size: 24rpx;
      font-family: PingFang SC;


      line-height: 40rpx;
    }
  }

  .item-address-browses {
    display: flex;
    justify-content: space-between;
    margin-top: 10rpx;

    .address {

      font-size: 24rpx;
      font-family: PingFang SC;

      color: #808080;
      line-height: 40rpx;
    }


  }

  .item-name-date {
    display: flex;
    justify-content: space-between;
    margin-top: 10rpx;

    .name {

      font-size: 34rpx;
      font-family: PingFang SC;
      color: #1A1A1A;
      line-height: 40rpx;
    }

    .date {

      font-size: 26rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #999999;
      line-height: 40rpx;
    }
  }
</style>
